import React, { useEffect } from "react";
import styles from "./index.module.less";
import cName from "classnames";
import { adpterShowNumber } from "@/utils/utils";

interface IProps { }

const OoopTable: React.FC<IProps> = (props: any) => {
  const { chatInfo, data = {} } = props;
  const idStr = `chat-ooopTable-component-${chatInfo.msgId}-${chatInfo.dataId}`;
  useEffect(() => { }, []);
  return (
    <div id={idStr} className={styles["ooop-table-wrapper"]}>
      <table className={styles["param-container-table"]}>
        <thead>
          <tr>
            {data?.culumns.map((item, index) => (
              <th key={index} className={styles["param-container-table-th"]}>
                {item}
              </th>
            ))}
          </tr>
        </thead>
        <tbody>
          {data?.data?.map((record, index) => (
            <tr key={index}>
              {record?.map((item, i) => (
                <td
                  key={`${index}-${i}`}
                  className={cName({
                    [styles["param-container-table-td"]]: item.type === 1,
                    [styles["param-container-table-number"]]: item.type === 2,
                  })}
                >
                  {/* {item.value || "--"} */}
                  {item.type === 1 ? item.value : adpterShowNumber(item?.value)}
                </td>
              ))}

              {/* <td className={styles["param-container-table-number"]}>
                {record.value || "--"}
              </td> */}
            </tr>
          ))}
        </tbody>
      </table>
    </div>
  );
};

export default OoopTable;
